<!DOCTYPE html>
<html class="no-js" lang="zh_CN">

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1, maximum-scale=1">
    <title>${system_admin_title}</title>
    #required_css
    <link rel="stylesheet" href="$!basePath/app/charts/style.css">
</head>
<body>#loading

<div class="app $!layout">
    <!-- 头部菜单 -->#header
    <section class="layout">
        <!-- 菜单 -->#sidebar
        <!-- 内容主体 -->
        <section class="container">
            <section class="main-content">
                <div class="content-wrap">
                    <div class="wrapper" style="background: #CCCCCC">
                        <form action="$!basePath/bi/charts/add/3" method="post">
                            <input type="hidden" name="type" value="$!type">
                            <input type="hidden" name="configs">
                        </form>
                        <div class="row">
                            <div class="col-lg-8 col-lg-offset-2">
                                <div class="panel">
                                    <div class="panel-heading text-center">
                                        <h4>图表数据源选择（2/4）</h4>
                                    </div>
                                    <div class="panel-body">
                                        <div class="row">
                                            <div class="col-lg-12">
                                                <div class="panel panel-default">
                                                    <div class="panel-heading">数据源列表</div>
                                                    <div class="panel-body">
                                                        <div class="row">
                                                        #foreach($!obj in $!dsList)
                                                        <div class="col-lg-2">
                                                            <div class="panel panel-default">
                                                                <div class="panel-heading">
                                                                    <i class="fa fa-database"></i>
                                                                    <div class="pull-right">
                                                                        <label>
                                                                            <input class="icheck" type="checkbox" name="dsId" value="$!obj.id" d-name="$!obj.name">
                                                                        </label>
                                                                    </div>
                                                                </div>
                                                                <div class="panel-body">
                                                                    $!obj.name
                                                                </div>
                                                            </div>
                                                        </div>
                                                        #end
                                                        </div>
                                                    </div>
                                                    <div class="panel-footer">
                                                        <button type="button" class="btn btn-default" onclick="doSelectDS()">确认选择</button>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="col-lg-12">
                                                <div class="panel panel-default">
                                                    <div class="panel-heading">已选数据源 - 参数配置</div>
                                                    <div class="panel-body">
                                                        <div class="row" id="dsAdapter"></div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="panel-footer text-right">
                                        <a class="btn btn-default" href="../add">上一步</a>
                                        <button type="button" id="btnNext" class="btn btn-primary" onclick="doNext()" disabled>下一步</button>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </section>
        </section>
    </section>
</div>
#required_js
<script src="$!basePath/app/datasource/datasource.js"></script>
<script src="$!basePath/framework/js/form/checkbox.js"></script>
<script type="text/javascript">
    var dsId;
    function doSelectDS() {
        dsId = [];
        var ids = [];
        $("input[name='dsId']:checked").each(function (i, n) {
            dsId.push({id: n.value, name: $(n).attr("d-name")});
            ids.push(n.value);
        });
        if (dsId.length == 0) return ns.alert("请选择数据源!");
        ns.asyncRequest("$!basePath/bi/charts/datasource", {ids: ids.toString(), type:"$!type"}, "#dsAdapter", function () {
            $("#btnNext").removeAttr("disabled");
        });
    }

    function doNext() {
        var configs = [];

        for (var i = 0; i < dsId.length; i++) {
            var config = {};
            config.id = dsId[i].id;
            config.name = $("input[name='" + config.id + "_name']").val();
            if (config.name.length == 0)
                config.name = dsId[i].name;
            config.xAxis = $("input[name='" + config.id + "_x']:checked").val();
            config.yAxis = $("input[name='" + config.id + "_y']:checked").val();
            config.rAxis = $("input[name='" + config.id + "_r']:checked").val();

            configs.push(config);
        }

        $("input[name='configs']").val(JSON.stringify(configs));

        $("form").submit();
    }

</script>
#loading_close
</body>

</html>